<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="/template/template.xhtml"
	xmlns:s="http://sduept.security.el/func">
	<ui:define name="head">
		<title>断路器运行风险评估</title>
		<link rel="stylesheet"
			href="#{request.contextPath}/resources/plugins/datatables/dataTables.bootstrap.css" />
		<link rel="stylesheet"
			href="/resources/bootstrap/css/bootstrap-datetimepicker.min.css" />
			<link rel="stylesheet" href="#{request.contextPath}/resources/css/myTable.css" />
		<style>

.box-header .box-title {
	font-size: 18px;
	font-family: "SimHei";
}

input {
	color: black;
}

.hand {
	cursor: pointer;
}

#chuandongFenxi .info-box-icon {
	font-size: 20px;
}

.wrap-condition .form-inline {
	float: left;
	margin: 0px 5px;
}

#specialStationTree .box-header {
	padding: 19px;
}

#chuandongFenxi p:nth-child(2) {
	font-size: x-large;
}

#chuandongFenxi p:nth-child(1) {
	font-size: large;
}

.ui-calendar input {
	width: 100%;
}

#info>div {
	padding: 0;
}

#totalNum, #abnormalNum {
	font-weight: bold;
	font-size: 18px;
	margin: 5px;
}
#pane1 .box{
   box-shadow:none;
}
</style>
	</ui:define>
	<ui:define name="content">
		<div class='full-center-content-scroll-noheader'>
			<div class="nav-tabs-custom">
				<ul class="nav nav-tabs pull-left">
					<li class="active"><a href="#pane2" id="tab2"
						data-toggle="tab">动作时间</a></li>
					<li id="tab1"><a href="#pane1" data-toggle="tab">熄弧时间</a></li>
					<li><a href="#shortCircuitPane" id="shortCircuit_tab"
						data-toggle="tab">短路电流</a></li>
				</ul>
				<div class="tab-content no-padding">
					<!-- 动作时间 -->
					<div class="chart tab-pane active" id="pane2"
						style="position: relative">
						<div class="box box-success">
							<div class='box-header with-border'>
								<h5 class='box-title'>断路器动作时间概率分布</h5>
							</div>
							<div class="box-body">
								<div class='wrap-condition'>
									<div class='form-inline'>
										<label>电压等级：</label> <select id='voltage2'
											class='vol form-control'>
											<option selected="selected">500kV</option>
										</select>
									</div>
									<div class='form-inline'>
										<label>断路器类型：</label> <select id='type2'
											class='type form-control'>
											<option selected="selected"></option>
											<option>SF6断路器</option>
											<option>中压断路器</option>
											<option>真空断路器</option>
											<option>低压断路器</option>
											<option>柱上断路器</option>
											<option>油断路器</option>
											<option>塑壳断路器</option>
											<option>模拟断路器</option>
										</select>
									</div>
									<div class='form-inline'>
										<label for='selectMan2'>厂商：</label> <select id='manufacture2'
											class='manufacture form-control'>
											<option selected="selected"></option>
											<option>ABB</option>
											<option>西门子西电</option>
											<option>平高</option>
											<option>许继</option>
											<option>正泰</option>
											<option>新东北电气沈阳高压开关</option>
											<option>锦开集团</option>
											<option>湖北开关</option>
										</select>
									</div>
									<div class='form-inline'>
										<label for='selectType2'>型号：</label> <select id='model2'
											class='model form-control'>
											<option selected="selected"></option>
											<option>型号1</option>
											<option>型号2</option>
											<option>型号3</option>
											<option>型号4</option>
										</select>
									</div>
									<div class='form-inline'>
										<p:outputLabel value="时间:"
											style="margin-right:5px;margin-left:5px;line-height:2" />
									</div>
									<div class='form-inline date'>
										<input type="text" class="form-control" id="startTime2"
											placeholder="起始日期" />至 <input type="text"
											class="form-control" id="endTime2" placeholder="终止日期" />
									</div>

									<button class='btn btn-default' id='check-btn2'>查询</button>

								</div>
								<div class="col-md-12">
									<!-- <div class="col-md-6">
										<div id="actProperty" style="height: 500px;"></div>
									</div>
									<div class="col-md-6">
										<div id="actPie" style="height: 500px;"></div>
									</div> -->
									<div id="actPie" style="height: 500px;"></div>
								</div>
							</div>
						</div>
					</div>
					<!-- 熄弧时间 -->
					<div class="chart tab-pane " id="pane1" style="position: relative">
						<div class='box box-success'>
							<div class='wrap-condition' style="padding: 10px">
								<div class='form-inline'>
									<label>电压等级：</label> <select id='voltage1'
										class='vol form-control'>
										<option selected="selected">500kV</option>
									</select>
								</div>
								<div class='form-inline'>
									<label>断路器类型：</label> <select id='type1'
										class='type form-control'>
										<option selected="selected"></option>
										<option>SF6断路器</option>
										<option>中压断路器</option>
										<option>真空断路器</option>
										<option>低压断路器</option>
										<option>柱上断路器</option>
										<option>油断路器</option>
										<option>塑壳断路器</option>
										<option>模拟断路器</option>
									</select>
								</div>
								<div class='form-inline'>
									<label for='selectMan'>厂商：</label> <select id='manufacture1'
										class='manufacture form-control'>
										<option selected="selected"></option>
										<option>ABB</option>
										<option>西门子西电</option>
										<option>平高</option>
										<option>许继</option>
										<option>正泰</option>
										<option>新东北电气沈阳高压开关</option>
										<option>锦开集团</option>
										<option>湖北开关</option>
									</select>
								</div>
								<div class='form-inline'>
									<label for='selectType'>型号：</label> <select id='model1'
										class='model form-control'>
										<option selected="selected"></option>
										<option>型号1</option>
										<option>型号2</option>
										<option>型号3</option>
										<option>型号4</option>
									</select>
								</div>
								<div class='form-inline'>
									<p:outputLabel value="时间:"
										style="margin-right:5px;margin-left:5px;line-height:2" />
								</div>
								<div class='form-inline date'>
									<input type="text" class="form-control" id="startTime1"
										placeholder="起始日期" />至 <input type="text"
										class="form-control" id="endTime1" placeholder="终止日期" />
								</div>

								<button class='btn btn-default' id='check-btn1'>查询</button>
							</div>
							<div class="row" style="padding: 10px 31px">
								共分析数据<span id='totalNum'>0</span>条，其中分析到熄弧时间异常<span
									id="abnormalNum">0</span>条。
							</div>


							<div class="row">
								<!-- <div class='col-md-12'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>断路器熄弧时间概率分布</h5>
										</div>
										<div class='box-body'>
											<div id="arcProperty" style="height: 500px;"></div>
										</div>
									</div>
								</div> -->
								<div class='col-md-6'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>断路器熄弧时间分布</h5>
										</div>
										<div class='box-body'>
											<div id="arcPie" style="height: 500px;"></div>
										</div>
									</div>
								</div>
								<div class='col-md-6'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>断路器熄弧时间概率分布</h5>
										</div>
										<div class='box-body'>
											<div id="arcProperty" style="height: 500px;"></div>
										</div>
									</div>
								</div>
								<div class='col-md-12 abnormalArcTimeTbWrap'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>熄弧时间异常分析结果</h5>
										</div>
										<div class='box-body'>
											<table id='abnormalArcTime' style="width:100%"
												class='table table-gray table-hover'>
											</table>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
<!-- 					<div class="chart tab-pane " id="pane1" style="position: relative">
						<div class='box box-success'>
							<div class='wrap-condition' style="padding: 10px">
								<div class='form-inline'>
									<label>电压等级：</label> <select id='voltage1'
										class='vol form-control'>
										<option selected="selected">500kV</option>
									</select>
								</div>
								<div class='form-inline'>
									<label>断路器类型：</label> <select id='type1'
										class='type form-control'>
										<option selected="selected"></option>
										<option>SF6断路器</option>
										<option>中压断路器</option>
										<option>真空断路器</option>
										<option>低压断路器</option>
										<option>柱上断路器</option>
										<option>油断路器</option>
										<option>塑壳断路器</option>
										<option>模拟断路器</option>
									</select>
								</div>
								<div class='form-inline'>
									<label for='selectMan'>厂商：</label> <select id='manufacture1'
										class='manufacture form-control'>
										<option selected="selected"></option>
										<option>ABB</option>
										<option>西门子西电</option>
										<option>平高</option>
										<option>许继</option>
										<option>正泰</option>
										<option>新东北电气沈阳高压开关</option>
										<option>锦开集团</option>
										<option>湖北开关</option>
									</select>
								</div>
								<div class='form-inline'>
									<label for='selectType'>型号：</label> <select id='model1'
										class='model form-control'>
										<option selected="selected"></option>
										<option>型号1</option>
										<option>型号2</option>
										<option>型号3</option>
										<option>型号4</option>
									</select>
								</div>
								<div class='form-inline'>
									<p:outputLabel value="时间:"
										style="margin-right:5px;margin-left:5px;line-height:2" />
								</div>
								<div class='form-inline date'>
									<input type="text" class="form-control" id="startTime1"
										placeholder="起始日期" />至 <input type="text"
										class="form-control" id="endTime1" placeholder="终止日期" />
								</div>

								<button class='btn btn-default' id='check-btn1'>查询</button>
							</div>
							<div class="row" style="padding: 10px 31px">
								共分析数据<span id='totalNum'>0</span>条，其中分析到熄弧时间异常<span
									id="abnormalNum">0</span>条。
							</div>


							<div class="row">
								<div class='col-md-6'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>断路器熄弧时间概率分布</h5>
										</div>
										<div class='box-body'>
											<div id="arcProperty" style="height: 500px;"></div>
										</div>
									</div>
								</div>
								<div class='col-md-6 abnormalArcTimeTbWrap'>
									<div class='box box-default'>
										<div class='box-header'>
											<h5 class='box-title'>熄弧时间异常分析结果</h5>
										</div>
										<div class='box-body'>
											<table id='abnormalArcTime' style="width:100%"
												class='table table-gray table-hover'>
											</table>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div> -->
					<!-- 短路电路 -->
					<div class="chart tab-pane" id="shortCircuitPane"
						style="position: relative; height: 750px">
						<div class="box box-success">
							<div class='box-header with-border'>
								<h5 class='box-title'>短路电流散点图</h5>
							</div>
							<div class="box-body" style="height: 750px">
								<div class='wrap-condition'>
									<!-- <div class='form-inline'>
										<label>电压等级：</label> 
										<select id='voltage2' class='vol form-control'>
											<option selected="selected">500kV</option>
										</select>
									</div> -->
									<div class='form-inline'>
										<label>断路器类型：</label> <select id='type_circuit'
											class='type form-control'>
											<option value=""></option>
											<option>SF6断路器</option>
											<option>中压断路器</option>
											<option>真空断路器</option>
											<option>低压断路器</option>
											<option>柱上断路器</option>
											<option>油断路器</option>
											<option>塑壳断路器</option>
											<option>模拟断路器</option>
										</select>
									</div>
									<div class='form-inline'>
										<label for='selectMan2'>厂商：</label> <select
											id='manufacture_circuit' class='manufacture form-control'>
											<option value=""></option>
											<option>ABB</option>
											<option>西门子西电</option>
											<option>平高</option>
											<option>许继</option>
											<option>正泰</option>
											<option>新东北电气沈阳高压开关</option>
											<option>锦开集团</option>
											<option>湖北开关</option>
										</select>
									</div>
									<div class='form-inline'>
										<label for='selectType2'>型号：</label> <select
											id='model_circuit' class='model form-control'>
											<option value=""></option>
											<option>型号2</option>
											<option>型号3</option>
											<option>型号4</option>
										</select>
									</div>
									<div class='form-inline'>
										<p:outputLabel for="startTime" value="开始时间:"
											style="margin-right:5px;margin-left:5px;line-height:2" />
									</div>
									<div class='form-inline'>
										<p:calendar id="startTime" pattern="yyyy-MM-dd"
											placeholder="开始时间" navigator="true" maxdate="Date()" />
									</div>
									<div class='form-inline'>
										<p:outputLabel for="endTime" value="至"
											style="margin-right:5px;margin-left:5px; line-height:2" />
									</div>
									<div class='form-inline'>
										<p:calendar id="endTime" placeholder="结束时间"
											pattern="yyyy-MM-dd" navigator="true" maxdate="Date()" />
									</div>
									<div class='form-inline'>
										<label for='maxTime'>开关量第一次动作时间最大值（单位：ms）：</label>
										<p:inputText id="maxTime" size="12" />
									</div>
									<button class='btn btn-default' id='checkBtn'
										style="margin-left: 10px">查询</button>
								</div>
								<div class="col-md-12">
									<div class="col-md-6">
										<div id="scatter" style="width: 600px; height: 650px;"></div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="pop" class="modal">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="false">x</span>
						</button>
						<h4 id="popTitle" class="modal-title"></h4>
					</div>
					<div class="modal-body" style="height: 500px">
						<div id="popBody" class="col-sm-12">
							<div id="popChart" style="height: 450px"></div>
						</div>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal-dialog -->
		</div>

		<h:form id="detailFrom">
			<p:dialog id="detailDialog" widgetVar="detailDialog" header=" 详细" width="1200" height="700"
				modal="true">
				<div class="tab-content" style="padding: 0;">
					<div class="chart" id="tableDiv" style="position: relative;">
						<table id="detailTable" class="table table-gray" style="width: 100%;word-break:break-all;">
						</table>
					</div>
				</div>
			</p:dialog>
		</h:form>
		
	</ui:define>

	<ui:define name="contentend">
		<script src="#{request.contextPath}/resources/js/tables/mytable.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/datatables/jquery.dataTables.min.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/datatables/dataTables.bootstrap.min.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/echarts/echarts.js"></script>
		<script src="#{request.contextPath}/resources/js/array-util.js"></script>
		<script
			src="#{request.contextPath}/resources/bootstrap/js/bootstrap-datetimepicker.min.js"></script>
		<script src="/resources/js/calendarLocale.js"></script>
		<script
			src="#{request.contextPath}/resources/bootstrap/js/bootstrap3-typeahead.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/pinyin/pinyin_dict_firstletter.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/pinyin/pinyinUtil.js"></script>
		<script
			src="#{request.contextPath}/resources/js/mycharts/categoryBarChart.js"></script>
		<script
			src="#{request.contextPath}/resources/js/mycharts/categoryLineChart.js"></script>
		<script
			src="#{request.contextPath}/resources/js/mycharts/category2YLineChart.js"></script>
		<script
			src="#{request.contextPath}/resources/js/math/GaussianDistribution.js"></script>
		<script	src="#{request.contextPath}/resources/js/math/SkewDistribution.js"></script>
		<script src="#{request.contextPath}/resources/js/mycharts/pieChart.js"></script>
		<script src="#{request.contextPath}/resources/js/mycharts/charts.js"></script>
		
		<script src="/resources/plugins/snapsvg/snap.svg.js"></script>
		<script src="breakerRunSafeAss.js?version=0.1"></script>
		<script src="ecStat.min.js"></script>
		<script src="scatterShort.js?version=0.1"></script>
		<script>
		function showSvg(){
			$("#maindiv").empty();
			var svgtxt = $("#form3\\:svgtext").val();
			if(svgtxt &amp;&amp; svgtxt.length > 0){
				$("#title").html("站内接线图");
				$("#maindiv").append(svgtxt);
				$("svg").attr("id","svgid" );
				var svg = Snap("#svgid");
				svg.drag();
				var svg= $("svg:first");
				if(svg){
					var w = svg.attr("width");
					var h = svg.attr("height");
					svg.removeAttr('viewBox');
					svg.attr("viewBox","0 0 "+w+" "+h);
				}
			}
		}
		</script>
	</ui:define>
</ui:composition>
